﻿* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

input, select {
    font-size: 12px;
    vertical-align: middle;
}

textarea, input {
    word-wrap: break-word;
    word-break: break-all;
    padding: 0;
}

li {
    list-style-type: none;
}

a {
    text-decoration: none;
    transition: all .6s;
    color: #424242;
}

i, em {
    font-style: normal;
}

input {
    outline: none
}

img {
    border: 0 none;
    max-width: 100%;
    vertical-align: middle;
}

@media screen and (min-width: 320px) {
    html {
        font-size: 21.333333333333332px;
    }

    body {
        font-size: 12px;
    }
}

@media screen and (min-width: 360px) {
    html {
        font-size: 24px;
    }

    body {
        font-size: 12px;
    }
}

@media screen and (min-width: 375px) {
    html {
        font-size: 25px;
    }

    body {
        font-size: 12px;
    }
}

@media screen and (min-width: 384px) {
    html {
        font-size: 25.6px;
    }

    body {
        font-size: 14px;
    }
}

@media screen and (min-width: 400px) {
    html {
        font-size: 26.666666666666668px;
    }

    body {
        font-size: 14px;
    }
}

@media screen and (min-width: 414px) {
    html {
        font-size: 27.6px;
    }

    body {
        font-size: 14px;
    }
}

@media screen and (min-width: 424px) {
    html {
        font-size: 28.266666666666667px;
    }

    body {
        font-size: 14px;
    }
}

@media screen and (min-width: 480px) {
    html {
        font-size: 32px;
    }

    body {
        font-size: 15.36px;
    }
}

@media screen and (min-width: 540px) {
    html {
        font-size: 36px;
    }

    body {
        font-size: 17.28px;
    }
}

@media screen and (min-width: 720px) {
    html {
        font-size: 48px;
    }

    body {
        font-size: 23.04px;
    }
}

@media screen and (min-width: 750px) {
    html {
        font-size: 50px;
    }

    body {
        font-size: 24px;
    }
}

.clear:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
    height: 0;
}

.clear {
    zoom: 1
}

body {
    background-color: #f5f5f5;
    font-family: '微软雅黑', PingFangSC-Regular, sans-serif;
}

header,footer{
    width: 100%;
    float: left;
}
header img,footer img{
    width: 100%;
    height: auto;
}
.ini1{
    background: #ffce66;
}
.ini-tit1{
    padding: .2rem 0;
    width: 100%;
    text-align: center;
}
.ini-tit1 span{
    display: inline-block;
    width: 10rem;
    line-height: 1.4rem;
    height: 1.6rem;
    border: .1rem solid #e8a926;
    background: #ff6249;
    color: #FFF;
    font-size: .62rem;
    border-radius: .9rem;
}
.ini-tit2{
    margin: .2rem 0 .6rem;
    width: 100%;
    text-align: center;
}
.ini-tit2 span{
    display: inline-block;
    width: 8rem;
    line-height: 1.2rem;
    height: 1.4rem;
    border: .1rem solid #e8a926;
    background: #ff6249;
    color: #FFF;
    font-size: .48rem;
    border-radius: .7rem;
    letter-spacing: .04rem;
}

.ini-ul{
    width: 11.2rem;
    margin: 0 auto;
    position: relative;
    padding: 0 .5rem;
}
.ini-ul .top{
    display: inline-block;
    position: absolute;
    top: -.15rem;
    left: 0;
    width: 11.2rem;
    height: .3rem;
    background: #cc8d0a;
    border-radius: .1rem;
    z-index: 1;
}
.ini-list{
    width: 100%;
    height: 5rem;
    overflow-y: hidden;
    border: .3rem solid #ffebc0;
}
.ini-list ul{
    width: 9.6rem;
    z-index: 10;
    position: relative;
    padding: 0 .5rem;
    background: #f0b5a5;
    top: 0;
}
.ini-list ul li{
    font-size: .54rem;
    color: #e85b3d;
    height: 1rem;
    line-height: 1rem;
    overflow: hidden;
}
.listTir{
    position: fixed;
    top: 100%;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 100;
    background: #f2f2f2;
    border-radius: .5rem .5rem 0 0;
    overflow:hidden;
    transition: all .3s;
}
.listTir.active{
    top: 1rem;
}
.list-close {
    position: absolute;
    top: .7rem;
    left: 1rem;
    width: 0.08rem;
    height: 1rem;
    background: #ff7364;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    display: inline-block;
}

.list-close:after {
    content: "";
    position: absolute;
    width: 0.08rem;
    height: 1rem;
    background: #ff7364;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}
.list-head{
    line-height: 2.4rem;
    height: 2.4rem;
    font-size: .76rem;
    color: #ff7364;
    background: #FFF;
    border-radius: .5rem .5rem 0 0;
    overflow:hidden;
    border-bottom: .04rem solid #e6e6e6;
}
.list-head p{
    text-align: center;
}
.list-ul{
    width: 100%;
    padding: 0 1rem;
    background: #FFF;
}
.list-ul li{
    padding: .4rem 0;
    position: relative;
    height: 2.6rem;
}
.list-ul li img{
    width: 1.6rem;
    height: 1.6rem;
    position: absolute;
    left: 0;
    top: .5rem;
    overflow: hidden;
    border-radius: 50%;
}
.list-ul li p{
    width: 100%;
    text-indent: 2rem;
    font-size: .62rem;
    color: #ff7364;
    line-height: 1.8rem;
    font-weight: 500;
    font-family: '微软雅黑', PingFangSC-Regular, sans-serif;
}
body{
    background: #ffce67;
}
.ini2{
    float: left;
    padding: 0 1rem;
    margin: .6rem 0;
    width: 100%;
    position: relative;
}
.ini2 .top{
    display: inline-block;
    position: absolute;
    top: -.15rem;
    left: 1rem;
    width: 13rem;
    height: .3rem;
    background: #cc8d0a;
    border-radius: .1rem;
    z-index: 1;
}
.ini2-ul{
    position: relative;
    margin: 0 .5rem;
    background: #FFF;
    z-index: 10;
    padding: .6rem .8rem;
}
.ini2-ul li{
    height: 1.6rem;
    line-height: 1.6rem;
    border-bottom: .06rem solid #b4b4b4;
    position: relative;
    float: left;
    width: 100%;
}
.ini2-ul li input{
    width: 100%;
    height: 100%;
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    text-indent: 1.5rem;
}
.ini2-ul li.tel{
    background: url("/wap/activity/dynamic/invite/images/5.png")no-repeat left .4rem;
    background-size: 1rem;
}
.ini2-ul li.yzm{
    background: url("/wap/activity/dynamic/invite/images/6.png")no-repeat left .4rem;
    background-size: 1rem;
}
.ini2-ul li.pas{
    background: url("/wap/activity/dynamic/invite/images/4.png")no-repeat left .4rem;
    background-size: 1rem;
}

.ini2-ul li span{
    display: inline-block;
    padding: .2rem .4rem;
    background: #ff6249;
    font-size: .6rem;
    color: #FFF;
    position: absolute;
    right: 0;
    bottom: .2rem;
    line-height: .8rem;
    border-radius: .2rem;
}
.ini2-ul li span.active{
    background: #b4b4b4;
    color: #FFF;
}
.ini2 .but{
    display: inline-block;
    width: 8rem;
    line-height: 1.4rem;
    height: 1.4rem;
    border: .1rem solid #e8a926;
    background: #ff6249;
    color: #FFF;
    font-size: .56rem;
    border-radius: .9rem;
    text-align: center;
    margin: .5rem 1.2rem .2rem;
}
.ini2 .buts{
    color: red;
    display: inline-block;
    width: 100%;
    font-size: .42rem;
    line-height: 1rem;
}
.inputs{
    font-size:.46rem;
}
}